import 'package:flutter/material.dart';
import 'package:flutter_deer/database/beans/get_user_info_entity.dart';
import 'package:flutter_deer/net/conmmon_net_util.dart';
import 'package:flutter_deer/net/dio_utils.dart';
import 'package:flutter_deer/net/http_api.dart';
import 'package:flutter_deer/res/resources.dart';
import 'package:flutter_deer/ui/setting/setting_item_data.dart';
import 'package:flutter_deer/ui/setting/setting_page1_person.dart';
import 'package:flutter_deer/ui/setting/setting_page2_speak.dart';
import 'package:flutter_deer/ui/setting/setting_page3_print.dart';
import 'package:flutter_deer/ui/setting/setting_page4_mdc.dart';
import 'package:flutter_deer/ui/setting/setting_page5_device.dart';
import 'package:flutter_deer/util/other_utils.dart';

/// design/8设置/index.html
class SettingPage extends StatefulWidget {
  const SettingPage({super.key});

  @override
  _SettingPageState createState() => _SettingPageState();
}

class _SettingPageState extends State<SettingPage> {
  int _selectedIndex = 0; // 当前选中的菜单索引

  String name = '';
  String phone = '';

  // 右侧内容区域根据选中菜单显示不同内容
  Widget _buildContent() {
    switch (_selectedIndex) {
      case 0:
        return const SettingPage1Person();
      case 1:
        return const SettingPage2Speak();
      case 2:
        return const SettingPage3Print();
      case 3:
        return const SettingPage4Mdc();
      case 4:
        return const SettingPage5Device();
      case 5:
        // PayTypeModel.getAll().then((value) {
        //   value.forEach((element) {
        //     print('${element.toString()}');
        //   });
        // });
        return const Center(child: Text('在收银页面长按支付方式或者支付按钮\n进入排序'));
      case 6:
        return const Center(child: Text('111配置'));
      default:
        return const Center(child: Text('默认设置区域'));
    }
  }

  @override
  void initState() {
    super.initState();
    name = GetUserInfoEntity.get()?.name ?? '';
    phone = GetUserInfoEntity.get()?.username ?? '';
  }

  @override
  Widget build(BuildContext context) {
    final reqTime = DateTime.now().millisecondsSinceEpoch;
    final memberCode = '1FF5CF34A541A4259E82E04A5988033A';
    final apiKey = '7C3581H4VD2C2BCTFGJKFV77V6SAC0NH';
    final deviceID = '00164263667139276';

    // 平板布局 - 左右分栏
    return Scaffold(
      body: Row(
        children: [
          // 左侧菜单区域
          Container(
            width: 280,
            color: Colours.bg_color,
            padding: const EdgeInsets.only(top: 8.0, bottom: 8.0, left: 8.0, right: 8.0),
            child: ListView(
              children: <Widget>[
                // 头像个人信息
                Material(
                  color: Colors.white,
                  borderRadius: BorderRadius.circular(3),
                  child: InkWell(
                    borderRadius: BorderRadius.circular(3),
                    hoverColor: Colours.bg_press,
                    onTap: () {
                      setState(() => _selectedIndex = 0);
                    },
                    child: Container(
                      padding: const EdgeInsets.symmetric(horizontal: 16, vertical: 11),
                      child: Row(
                        children: [
                          // 左侧头像
                          const Padding(padding: EdgeInsets.only(right: 6), child: Icon(Icons.account_circle, size: 42, color: Colours.bg)),

                          // 中间标题和描述
                          Expanded(
                            child: Column(
                              mainAxisAlignment: MainAxisAlignment.center,
                              crossAxisAlignment: CrossAxisAlignment.start,
                              children: [
                                Text(name, style: const TextStyle(fontSize: 16, fontWeight: FontWeight.w500, color: Colors.black87)),
                                const SizedBox(height: 4),
                                Text(phone, style: const TextStyle(fontSize: 12, color: Colors.grey)),
                              ],
                            ),
                          ),

                          // 右侧箭头
                          const Icon(Icons.arrow_forward_ios, color: Colors.grey, size: 18),
                        ],
                      ),
                    ),
                  ),
                ),
                const SizedBox(height: 8),

                // 语音播报和打印控制组合项
                _buildSettingGroup([
                  SettingItemData(
                    title: '语音播报',
                    trailing: const Text('', style: TextStyle(fontSize: 12, color: Colors.grey)),
                    showArrow: true,
                    onTap: () {
                      setState(() => _selectedIndex = 1);
                    },
                    tag: '1',
                  ),
                  SettingItemData(
                    title: '打印控制',
                    trailing: const Text('', style: TextStyle(fontSize: 12, color: Colors.grey)),
                    showArrow: true,
                    onTap: () {
                      setState(() => _selectedIndex = 2);
                    },
                    tag: '2',
                  ),
                ]),
                const SizedBox(height: 8),

                // 零管配置
                _buildSettingGroup([
                  SettingItemData(
                    title: '集线器配置',
                    trailing: const Text('', style: TextStyle(fontSize: 12, color: Colors.grey)),
                    showArrow: true,
                    tag: '3',
                    onTap: () {
                      CommonNetUtil.requestNetworkGbPrinter<String>(Method.post, url: HttpApi.gbPrinter_getStatus, params: {
                        'reqTime': reqTime,
                        'securityCode': '$memberCode${reqTime}${apiKey}'.toMd5,
                        'memberCode': memberCode,
                        'deviceID': deviceID,
                      }, onSuccess: (data) {
                        print(' 获取打印机状态成功 $data');
                      });
                      setState(() => _selectedIndex = 3);
                    },
                  ),
                ]),
                const SizedBox(height: 8),

                // 系统设置
                _buildSettingGroup([
                  SettingItemData(
                    title: '设备管理',
                    trailing: const Text('', style: TextStyle(fontSize: 12, color: Colors.grey)),
                    showArrow: true,
                    onTap: () async {
                      setState(() => _selectedIndex = 4);
                    },
                  ),
                  SettingItemData(
                    title: '支付方式',
                    trailing: const Text('', style: TextStyle(fontSize: 12, color: Colors.grey)),
                    showArrow: true,
                    onTap: () async {
                      setState(() => _selectedIndex = 5);
                    },
                  ),
                ]),
                const SizedBox(height: 18),
              ],
            ),
          ),
          // 右侧内容区域
          Expanded(
            child: _buildContent(),
          ),
        ],
      ),
    );
  }

  // 构建设置项组
  Widget _buildSettingGroup(List<SettingItemData> items) {
    return Material(
      color: Colors.white,
      borderRadius: BorderRadius.circular(3),
      child: Column(
        mainAxisSize: MainAxisSize.min,
        children: items.map((item) {
          final int index = items.indexOf(item);
          final bool isSelected = _selectedIndex.toString() == item.tag;
          return Column(
            mainAxisSize: MainAxisSize.min,
            children: [
              Material(
                  color: isSelected ? Theme.of(context).primaryColor.withOpacity(0.1) : Colors.transparent,
                  child: InkWell(
                    hoverColor: Colours.bg_press,
                    onTap: item.onTap,
                    child: Container(
                      padding: const EdgeInsets.symmetric(horizontal: 16, vertical: 12),
                      child: Row(
                        children: [
                          Expanded(
                            child: Text(item.title, style: const TextStyle(fontSize: 16, fontWeight: FontWeight.bold, color: Colors.black87)),
                          ),
                          if (item.trailing != null) item.trailing!,
                          if (item.showArrow) const Icon(Icons.arrow_forward_ios, color: Colors.grey, size: 18),
                        ],
                      ),
                    ),
                  )),
              if (index < items.length - 1) const Divider(height: 1, thickness: 1, indent: 16, endIndent: 16),
            ],
          );
        }).toList(),
      ),
    );
  }
}
